.role-admin-manage {
  display: flex;
  flex-direction: column;
  height: 100%;

  &>.title {
    font-size: 16px;
    font-weight: 600;
  }

  .content {
    display: flex;
    flex: 1;
    height: 100%;
    margin-top: 8px;

    .left {
      width: 245px;
      height: 100%;
      background: var(--module);
      border-radius: 6px;
      padding: 16px;

      .btn-new-role {
        text-align: center;
        margin-bottom: 16px;

        .arco-btn {
          width: 213px;
          height: 30px;
        }
      }

      .arco-tree-node {
        color: var(--font-3);

        .arco-tree-node-indent {
          display: none;
        }
      }

      .arco-tree-node.arco-tree-node-selected {
        background-color: var(--select-hover);
      }
    }

    .right {
      display: flex;
      flex-direction: column;
      margin-left: 2px;
      flex: 1;
      height: 100%;
      top: 100px;
      background: var(--module);
      border-radius: 6px;
      padding: 24px 20px 0px;
      white-space: nowrap;

      .header {
        display: flex;
        justify-content: space-between;
        align-items: center;

        .l {
          .arco-input-inner-wrapper {
            background-color: var(--bg);
            width: 200px;
            height: 30px;
            border-radius: 5px;
          }

          .arco-select {
            margin-left: 12px;
            background: var(--bg);
            height: 30px;
            border-radius: 5px;

            .arco-select-view {
              height: 30px;
              border-radius: 5px;
            }
          }

          .role-name {
            font-size: 16px;
          }
        }

        .l,
        .r {
          display: flex;
          align-items: center;

          .arco-input {
            font-size: 12px;
            color: var(--font-3);
          }
          .role_remove{
            background-color: var(--table-delete) !important;
            color: var(--common-white);
          }
        }
      }

      .function-authority {
        .prompt {
          font-size: 14px;
          color: var(--font-2);
          margin-bottom: 20px;
        }

        .arco-checkbox {
          margin-right: 20px;
        }

        .arco-collapse {
          border: 1px solid var(--border-line);
          margin-top: 20px;

          .arco-collapse-item-active .arco-collapse-item-header {
            border-bottom: 1px solid var(--border-line);
          }

          .arco-collapse-item-header {
            background: var(--bg);
            color: var(--font-1);
            padding: 12px 16px;
          }
        }

        .arco-collapse-item-content {
          color: var(--font-1);
          background: transparent;
        }

        .arco-collapse-item-content-box {
          padding: 16px;
        }

        .arco-checkbox-text {
          margin-left: 8px;
        }
      }

      .role-member-list {
        display: flex;
        flex-direction: column;
        height: 100%;
       
        .arco-table-body{
          max-height: 63vh;
        }
      }

      .arco-tabs {
        flex: 1;

        .arco-tabs-pane {
          display: flex;
          flex-direction: column;
          .arco-input-group-wrapper {
            margin-bottom: 20px;

            .arco-input-inner-wrapper {
              background: var(--bg);
            }
          }

          .arco-pagination {
            margin-top: auto;
          }
        }
      }
    }
  }
}

.runnerGo-update-role-modal {
  p {
    color: var(--font-3);
  }
}